import React from 'react';
import DataTable from '../../UI/DataTable';
import PageContainer from '../../UI/PageContainer';
import './ConferencePage.css';

const ConferencePage = () => {
  const data = [
    {
      id: 1,
      title: '国际人工智能会议论文',
      doi: '10.1000/conf001',
      keywords: '人工智能, 会议论文, 算法',
      authors: '张三, 李四',
      authorRank: '第一作者',
      conferenceName: 'AAAI 2023',
      conferenceNameShort: 'AAAI',
      conferenceDate: '2023-02-07',
      conferenceLocation: '华盛顿, 美国',
      conferencePage: '1234-1242',
      conferenceField: '人工智能',
      conferenceCitation: '45',
      files_original: [
        { name: 'AAAI论文.pdf', size: 2048576, type: 'application/pdf' }
      ],
      files_attachment: [
        { name: '实验代码.zip', size: 3072000, type: 'application/zip' },
        { name: '数据集.csv', size: 1024000, type: 'text/csv' }
      ],
      files_poster: [
        { name: '会议海报.png', size: 5120000, type: 'image/png' }
      ],
      files_oralPoster: [
        { name: 'Oral展示.pptx', size: 15360000, type: 'application/vnd.openxmlformats-officedocument.presentationml.presentation' }
      ]
    },
    {
      id: 2,
      title: '机器学习前沿技术研究',
      doi: '10.1000/conf002',
      keywords: '机器学习, 深度学习, 神经网络',
      authors: '王五, 赵六',
      authorRank: '第二作者',
      conferenceName: 'ICML 2023',
      conferenceNameShort: 'ICML',
      conferenceDate: '2023-07-23',
      conferenceLocation: '檀香山, 美国',
      conferencePage: '5678-5686',
      conferenceField: '机器学习',
      conferenceCitation: '78',
      files_original: [
        { name: 'ICML论文.pdf', size: 2560000, type: 'application/pdf' }
      ],
      files_attachment: [
        { name: '模型实现.py', size: 768000, type: 'text/x-python' },
        { name: '训练日志.txt', size: 256000, type: 'text/plain' }
      ],
      files_poster: [
        { name: '研究海报.jpg', size: 4096000, type: 'image/jpeg' }
      ],
      files_oralPoster: [
        { name: '演讲PPT.pptx', size: 8192000, type: 'application/vnd.openxmlformats-officedocument.presentationml.presentation' }
      ]
    }
  ];

  const stats = [
    { value: 2, label: '会议论文' },
    { value: 1, label: '第一作者' },
    { value: 2, label: '国际会议' }
  ];

  const columns = [
    {
      key: 'title',
      title: '标题',
      width: '250px',
      render: (value) => (
        <div className="conference-page__title">{value}</div>
      )
    },
    { key: 'doi', title: 'DOI', width: '120px' },
    { 
      key: 'keywords', 
      title: '关键词', 
      width: '200px',
      render: (value) => (
        <div className="conference-page__keywords">{value}</div>
      )
    },
    { key: 'authors', title: '作者', width: '150px' },
    {
      key: 'authorRank',
      title: '作者位次',
      width: '100px',
      render: (value) => (
        <span className={`conference-page__rank-badge conference-page__rank-badge--${value}`}>
          {value}
        </span>
      )
    },
    { key: 'conferenceName', title: '会议名称', width: '150px' },
    { key: 'conferenceNameShort', title: '会议缩写', width: '100px' },
    { key: 'conferenceDate', title: '举办时间', width: '100px' },
    { key: 'conferenceLocation', title: '举办地点', width: '120px' },
    { key: 'conferencePage', title: '页码', width: '80px' },
    { key: 'conferenceField', title: '所属领域', width: '120px' },
    { key: 'conferenceCitation', title: '被引次数', width: '100px' },
    {
      key: 'actions',
      title: '操作',
      width: '120px',
      render: () => (
        <div>
          <a className="data-table__action-link data-table__action-link--edit">编辑</a>
          <a className="data-table__action-link data-table__action-link--delete">删除</a>
        </div>
      )
    }
  ];

  return (
    <PageContainer className="conference-page">
      <DataTable
        data={data}
        columns={columns}
        showSearch={true}
        title="会议论文"
        titleIcon="conference"
        editType="conference"
        searchPlaceholder="搜索标题、作者、会议..."
        filterOptions={['已发表', '待发表', '审稿中']}
        onNew={() => console.log('新建会议论文')}
        onFilter={() => console.log('筛选会议论文')}
        showPagination={true}
        pageSize={20}
        className="conference-page__table"
      />
    </PageContainer>
  );
};

export default ConferencePage;
